<!-- 接受数据格式
data = {
	title:'',
	opts:[{
	name:'',
	key:'',
	type:'' input/select,
	options:[],

	}]
}
 -->
}
<template>
	<!-- 新增对话框 -->
    <el-dialog 
    :title="data.title"
    :visible.sync="isVisible"
    width="80%"
    custom-class="lx_modal"
    >
		<div class="line"></div>
		<div style="max-height: 344px;overflow-y: scroll;">
			<div class=" flex_h justify_between no-b mt20" v-for="(opt,optIndex) in data.opts">
				<span>{{opt.name}}</span>
				<el-select v-model="submitData[opt.key]" placeholder="请选择" size="small" class="btn-210" v-if="opt.type == 'select'">
		            <el-option
		              v-for="(item,index) in opt.options"
		              :key="index"
		              :label="item"
		              :value="item">
		            </el-option>
		        </el-select>
		        <el-input size="small" v-if="opt.type == 'input'" class="btn-210"></el-input>
			</div>
		</div>
		<div class=" flex_h justify_between no-b mt20">
			<el-button type="info" @click="cancel">
                取消
            </el-button>
            <el-button type="primary" class="btn-210" @click="submit">
               确认添加
            </el-button>
		</div>
    </el-dialog>
</template>
<script>
	export default{
		data(){
			return{
				submitData:{}
			}
		},
		props:['data','isVisible','cancelCb','submitCb'],
		methods:{
			cancel(){
				this.cancelCb && this.cancelCb();
			},
			submit(){
				this.submitCb && this.submitCb(this.submitData);
			}
		}
	}
</script>
<style lang="less">
.line{
    height: 3px;
    background-image: linear-gradient(to right,#279DF4,#36CEF9);
}
.lx_modal{
	border-radius: 5px;
		.el-dialog__body{
		padding: 10px 20px;
	}
	.el-dialog__header{
		text-align: left;
	}
}

</style>